import React from 'react'
// 1- 使用 lazy Suspense
import { lazy, Suspense } from 'react'
import { useRoutes } from 'react-router-dom';
import Loading from '@/components/Loading'
import AuthComponent from '@/components/AuthComponent';
//封装懒加载函数
const lazyLoading = function (path: string) {
    const Com = lazy(() => import('@/pages/' + path))
    return (
        <Suspense fallback={<Loading />}>
           <Com></Com>
        </Suspense>
    )
}


export default function () {
    const renderRouter = useRoutes([
        {
            path: '/',
            element: (
                <AuthComponent>
                    {lazyLoading("Index")}
                </AuthComponent>)
        },
        {
            path: '/login',
            element: lazyLoading("Login")
        },
        {
            path: '*',
            element: lazyLoading("NotFound")
        },
    ])

    return renderRouter;
}
